<

マテリアルコンポーネントウィジェット

資料3 カタログページ

ビジュアル、動作、モーション豊富なウィジェットを実装し、資料3デザイン仕様。

マテリアル 3 は、2023 年後半にデフォルトの Flutter インターフェイスになります。この移行の詳細については、こちらをご覧ください。マテリアル 3 の flutterのサポート。

マテリアル 3 をオプトインするには、useMaterial3にフラグを立てるtrueあなたのテーマで。

これらのウィジェットの動作を確認するには、ライブ マテリアル 3 をチェックしてください。デモアプリ。

まだ私たちの遺産をチェックできますマテリアル 2 ウィジェットカタログページをご覧ください。

行動

共通ボタン

電子メールの送信、ドキュメントの共有、コメントへの「いいね!」などのアクションを開始するクリック可能なブロック。

FAB

キーアクションをトリガーするクリック可能なブロック。このブロックにはアイコンが含まれており、キーアクションを手の届く範囲に保つためにアプリのインターフェイス内にフロートします。

拡張FAB

アクションをトリガーするクリック可能なブロック。これらの幅の広いブロックはテキスト ラベルに適合し、より大きなターゲット領域を提供できます。

アイコンボタン

クリック可能なアイコンにより、アプリ ユーザーに補足的なアクションの実行を促します。

セグメント化されたボタン

オプションの選択、ビューの切り替え、要素の並べ替えを支援する、単一または複数の選択されたクリック可能なブロック。

コミュニケーション

バッジ

カウントやステータスなどの動的なコンテンツを伝えるアイコンのようなブロック。ラベルまたは番号を含めることができます。

進行状況インジケーター

アプリの読み込みやフォームの送信など、進行中のプロセスが完了すると色が変わる縦線。

スナックバー

画面の下部に表示されるアプリのプロセスに関する簡単なメッセージ。

封じ込め

ボトムシート

補足コンテンツを画面の下部に固定するコンテナー。

カード

丸い角とドロップ シャドウのあるボックス内に表示される、関連するコンテンツの略称のコンテナー。

ダイアログ

アプリユーザーに追加のデータを提供するか決定を下すよう促す、ホバーリングコンテナ。

ディバイダー

リストとコンテナ内のコンテンツをグループ化する細い線。

リスト

テキストまたは画像を表示する連続した垂直インデックス。

アプリバー

画面の上部にコンテンツとアクションを表示するコンテナー。

下部のアプリバー

画面の下部にナビゲーションとキーアクションを表示するコンテナー。

ナビゲーションバー

アプリ内の主な宛先間の切り替えを可能にする永続コンテナー。

ナビゲーションドロワー

アプリの先端からスライドしてアプリ内の他のセクションに移動するコンテナー。リーディングエッジは左側に落ちます...

ナビゲーションレール

タブレットやデスクトップ画面の先端にある永続的なコンテナで、アプリの各部分に移動します。リーディングエッジは左側に落ちます...

タブバー

さまざまな画面、データセット、その他のインタラクションにわたってコンテンツを整理する階層化されたコンテナー。

選択

チェックボックス

アプリ ユーザーがセットから 1 つ以上のオプションを選択または選択解除できるフォーム コントロール。オプションを選択して有効にするか...

チップ

情報の入力、選択、コンテンツのフィルタリング、またはアクションのトリガーを簡素化する小さなブロック。

日付ピッカー

日付または日付の範囲を選択するために使用されるカレンダー インターフェイス。

メニュー

一時的なサーフェス上に選択肢のリストを表示するコンテナー。

ラジオボタン

アプリ ユーザーがセットから 1 つのオプションのみを選択するために選択またはクリアできるフォーム コントロール。オプションを選択して有効にするかクリアします...

スライダー

値の範囲を選択できるフォーム コントロール。

スイッチ

単一の項目の状態をオンまたはオフに変更するトグル コントロール。

タイムピッカー

特定の時間を選択および設定するために使用されるクロック インターフェイス。

テキスト入力

テキストフィールド

アプリユーザーがテキストを入力できるボックス。これらはフォームとダイアログに表示されます。

その他のウィジェットについては、ウィジェットカタログ